<template>
  <el-checkbox-group v-bind="$attrs" @input="handleCheckBox">
    <el-checkbox
      :label="item.roleId"
      v-for="item in roleList"
      :key="item.roleId"
      >{{ item.name }}</el-checkbox
    >
  </el-checkbox-group>
</template>

<script>
import api from "@/api/modules/login";
export default {
  name: "RoleGroup",
  data() {
    return {
      // formCheckboxGroup: {
      //   checkList: [],
      // },
      checkList: [],
      roleList: [],
      userType: null
    };
  },
  watch: {
    // $attrs: {
    //   handler (val) {
    //     if (val.formData.userType) {
    //       let type = val.formData.userType
    //       if (type === 1) {
    //         this.userType = type
    //         return
    //       } else {
    //         let roles = val.formData.roleDetails
    //         let mapRoleId = roles.map(x => x.roleId)
    //         this.checkList = mapRoleId
    //         // this.$set(this.checkList, 0, mapRoleId)
    //       }
    //     }
    //   }
    // }
  },
  created() {
    this.getRoleGroup();
  },
  methods: {
    async getRoleGroup() {
      let params = { size: 100 };
      let role = await api.roleGroup(params);
      let { data } = role;
      this.roleList = data.records.filter((item) => {
        return item.roleStatus === 1;
      });
    },
    handleCheckBox(value) {
      this.$emit("input", value);
    }
  }
};
</script>

<style></style>
